﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function () {
        $("#btn1").click(function () {
            $("#test1").text(function (i, origText) {
                return "Old text: " + origText + " New text: Hello world! (index: " + i + ")";
            });
        });

        $("#btn2").click(function () {
            $("#test2").html(function (i, origText) {
                return "Old html: " + origText + " New html: Hello <b>world!</b> (index: " + i + ")";
            });
        });

    });
</script>
</head>

<body>
<p id="test1">This is a <b>bold</b> paragraph.</p>
<p id="test2">This is another <b>bold</b> paragraph.</p>
<button id="btn1">Show Old/New Text</button>
<button id="btn2">Show Old/New HTML</button>
</body>
</html>
